<script setup>
const props = defineProps('data')
</script>
<template>
  <section
    class="h-32rem w-24rem border-1 surface-border border-round p-4 flex flex-column align-content-center relative"
  >
    <section class="flex flex-column align-items-center mb-5">
      <div class="text-2xl mb-3">
        <img src="/mock/ji_gou/22222_20230427134316A014.png" />
      </div>
      <section class="flex justify-content-center align-items-center gap-2">
        <article class="text-2xl font-bold">房易贷</article>
        <Tag value="普惠金融"></Tag>
        <Tag value="新市民"></Tag>
      </section>
    </section>

    <section class="mb-5">
      <article class="w-full text-center text-3xl">
        <span class="text-6xl text-primary">3.85-4.50</span>%
      </article>
      <article class="w-full text-center">参考利率(年化)</article>
    </section>

    <section class="w-full flex justify-content-center mb-5">
      <section class="flex flex-column">
        <article class="w-full text-center text-2xl">1.00-1000.00</article>
        <article class="w-full text-center">贷款额度(万元)</article>
      </section>
      <Divider layout="vertical" />
      <section class="flex flex-column">
        <article class="w-full text-center text-2xl">12-36</article>
        <article class="w-full text-center">贷款期限(月)</article>
      </section>
    </section>
    <Button label="查看详情" size="large" class="bottom-auto" outlined />
  </section>
</template>
